<template>
  <div>
    <div>Hello</div>
    <!-- 直接使用根模块 -->
    <p>{{ $store.state.username }}</p>
    <p>{{ $store.getters.newName }}</p>
  </div>
  <router-view></router-view>
</template>

<script>
  // 引入vuex仓库  方法：useStore（拿到仓库实例）
  import { useStore } from 'vuex'
  export default {
    name: 'App',
    // 固定的setup
    setup() {
      // 使用vuex仓库
      const store = useStore()
      // 使用根目录 state 数据
      console.log(store.state.username)
      console.log(store.getters.newName)
    },
  }
</script>

<style lang="scss" scoped></style>
